@charset "utf-8";

.rel {
    position: relative;
}

* {
    padding-bottom: 0px;
    margin: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
}

.shiying {
    bottom: 5vh;
    z-index: 0;
    text-align: center;
    font-size: 12px;
    width: 100vw;
    position: absolute;
    color: #a1a2a6;
}

video {
    opacity: .8
}

/*video {position: fixed; right: 0; bottom: 0; min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: -100; background-size: cover; }*/
img {
    margin: 0 auto;
}

.clearBoth {
    clear: both;
}

.btn-nav {
    opacity: 1;
    transition: 1.5s;
}

.activenone {
    opacity: 1;
    transition: 1.5s;
}

#myVideo {
    z-index: 1;
    position: absolute;
    background-color: black;
    width: 100%;
    bottom: 0px;
    background-position: center center;
    height: 100%;
    top: 0px;
    right: 0px;
    background-size: contain;
    object-fit: cover;
}

BODY {
    padding-bottom: 0px;
    margin: 0px;
    padding-left: 0px;
    padding-right: 0px;
    background: #fff;
    color: #58595b;
    font-size: 14px;
    padding-top: 0px;
}

A {
    color: #fff;
    font-size: 14px;
    text-decoration: none;
}

#menu {
    padding-bottom: 0px;
    list-style-type: none;
    padding-left: 0px;
    width: 182px;
    padding-right: 0px;
    background: url(/skin/img/mtsdh01.png);
    height: 100%;
    right: 0px;
    padding-top: 0px;
}

#menu LI {
    margin: 0px 0px 20px;
    float: left;
    font-size: 12px;
}

#menu A {
    text-align: left;
    padding-bottom: 0px;
    line-height: 32px;
    text-transform: uppercase;
    padding-left: 55px;
    width: 182px;
    padding-right: 0px;
    display: block;
    background: url(/skin/img/dh_hover.png) no-repeat 182px center;
    height: 32px;
    color: #fff;
    font-size: 16px;
    text-decoration: none;
    padding-top: 0px;
}

#menu A:hover {
    padding-bottom: 0px;
    line-height: 32px;
    background: url(/skin/img/dh_hover.png) no-repeat 0px center;
    width: 182px;
    padding-right: 0px;
    height: 32px;
    color: #000;
    /*    background-position: 20px -50px;*/
    text-decoration: none;
    padding-top: 0px;
    transition: 500ms;
}

#menu .active A {
    background: url(/skin/img/dh_hover.png) no-repeat 0px center;
    color: #000;
    transition: 500ms;
}

#menu .navleft A.logo {
    padding-bottom: 0px;
    margin: 0px auto;
    padding-left: 0px;
    width: 164px;
    padding-right: 0px;
    display: block;
    background: url(/skin/img/logo.png) no-repeat center center;
    height: 52px;
    padding-top: 0px;
    transition: 500ms;
}

/* #menu .navleft A.logo:hover {padding-bottom: 0px; margin: 0px auto; padding-left: 0px; width: 100%; padding-right: 0px; display: block; background: url(/skin/img/logo.png) #a2000f no-repeat center center; height: 115px; padding-top: 0px; } */
#menu LI.navleft {
    width: 182px;
    margin-bottom: 60px;
    float: left;
    margin-top: 50px;
    margin-right: 0px;
}

.logoA {
    width: 120px;
    height: 160px;
    position: fixed;
    z-index: 999;
    top: 30px;
    left: 30px;
    opacity: 1;
    text-align: left;
    transition: 0.5s;
}

.logoA-active {
    position: fixed;
    top: 40px;
    left: 30px;
    z-index: 999;
    opacity: 1;
    text-align: left;
    transition: 0.5s;
}

.logoA .clickimg {
    position: fixed;
    left: 30px;
    top: 20px;
    cursor: pointer;
    transition: 0.5s;
}

.logoA-active .clickimg {
    position: fixed;
    left: 30px;
    top: 20px;
    cursor: pointer;
    transition: 0.5s;
}

ul.kf {
    width: 34px;
    margin: 0 auto;
}

ul.kf li {
    width: 34px;
    margin-bottom: 20px;
    position: relative;
    height: 34px;
}

ul.kf li a.kf1,
ul.kf li a.kf2,
ul.kf li a.kf3,
ul.kf li a.kf4,
ul.kf li a.kf5 {
    width: 34px;
    height: 34px;
    right: 0;
    display: block;
    background: rgba(90, 90, 90, 0.6) url(/skin/img/mkf.png) no-repeat;
    -moz-border-radius: 20px;
    /* -webkit-border-radius: 20px; */
    /* border-radius: 20px; */
    text-align: left;
    transition: 500ms;
    overflow: hidden;
    position: absolute;
    margin: 0 auto;
}

ul.kf li a span {
    opacity: 0;
    color: #58595b;
    padding-left: 20px;
    line-height: 34px;
}

ul.kf li img {
    transition: 0.5s;
    transition-delay: 0.5s;
    opacity: 0;
    position: absolute;
    top: -46px;
    height: 80px;
    width: 85px;
    max-width: 85px;
    left: -223px;
}

ul.kf li a.kf1:hover,
ul.kf li a.kf2:hover,
ul.kf li a.kf4:hover,
ul.kf li a.kf5:hover {
    border-radius: 20px 20px;
    background: #f1f1f1 url(/skin/img/mkf2.png) no-repeat
}

ul.kf li a.kf2 {
    background-position: 0 -34px
}

ul.kf li a.kf2:hover {
    background-position: 0 -34px
}

ul.kf li a.kf3 {
    background-position: 0 -68px
}

ul.kf li a.kf4 {
    background-position: -132px 0
}

ul.kf li a.kf4:hover {
    background-position: -132px 0
}

ul.kf li a.kf5 {
    background-position: -176px 0
}

ul.kf li a.kf5:hover {
    background-position: -176px 0
}

.news_list_met_m1156_3_6 {
    display: none;
}

.ih-item.circle.effect6 .img {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 0.35s ease-in-out;
    -moz-transition: all 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
}

.ih-item.circle.effect6.colored .info {
    background: #1a4a72;
}

.ih-item.circle.effect6 .info {
    opacity: 0;
    -webkit-transition: all 0.35s ease-in-out;
    -moz-transition: all 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
}

.ih-item.circle.effect6 .info h3 {
    color: #fff;
    text-transform: uppercase;
    position: relative;
    letter-spacing: 2px;
    font-size: 22px;
    margin: 0 30px;
    padding: 55px 0 0 0;
    height: 110px;
    text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
}

.ih-item.circle.effect6 .info p {
    color: #bbb;
    padding: 10px 5px;
    font-style: italic;
    margin: 0 30px;
    font-size: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.5);
}

.ih-item.circle.effect6.scale_up .info {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
}

.ih-item.circle.effect6.scale_up a:hover .img {
    opacity: 0;
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}

.ih-item.circle.effect6.scale_up a:hover .info {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.ih-item.circle.effect6.scale_down .info {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}

.ih-item.circle.effect6.scale_down a:hover .img {
    opacity: 0;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
}

.ih-item.circle.effect6.scale_down a:hover .info {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.ih-item.circle.effect6.scale_down_up .info {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
    -webkit-transition: all 0.35s ease-in-out 0.2s;
    -moz-transition: all 0.35s ease-in-out 0.2s;
    transition: all 0.35s ease-in-out 0.2s;
}

.ih-item.circle.effect6.scale_down_up a:hover .img {
    opacity: 0;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
}

.ih-item.circle.effect6.scale_down_up a:hover .info {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.ih-item.circle .info {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    border-radius: 50%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.navright {
    width: 177px;
    margin-right: 0px;
    text-align: center;
    position: absolute;
    right: 0;
    text-align: center;
    bottom: 30px;
}

.copyright {
    padding-top: 5px;
    color: #858585;
    font-size: 11px;
}

ul.kf-b {
    width: 132px;
    margin: 0 auto;
    height: 34px;
}

ul.kf-b li {
    width: 34px;
    margin-left: 5px;
    margin-right: 5px;
    float: left;
}

ul.kf-b li a.kf1,
ul.kf-b li a.kf2,
ul.kf-b li a.kf3,
ul.kf-b li a.kf4,
ul.kf-b li a.kf5 {
    width: 34px;
    height: 34px;
    display: block;
    background: #434343 url(/skin/img/kf.png) no-repeat;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    text-indent: -999px;
    transition: 500ms;
    overflow: hidden
}

ul.kf-b li a.kf1:hover,
ul.kf-b li a.kf2:hover,
ul.kf-b li a.kf3:hover,
ul.kf-b li a.kf4:hover,
ul.kf-b li a.kf5:hover {
    background: #ffc34f url(/public/static/modules/cms/imageskf2.png) no-repeat;
}

ul.kf-b li a.kf2 {
    background-position: -44px 0
}

ul.kf-b li a.kf2:hover {
    background-position: -44px 0
}

ul.kf-b li a.kf3 {
    background-position: -88px 0
}

ul.kf-b li a.kf3:hover {
    background-position: -88px 0
}

ul.kf-b li a.kf4 {
    background-position: -132px 0
}

ul.kf-b li a.kf4:hover {
    background-position: -132px 0
}

ul.kf-b li a.kf5 {
    background-position: -176px 0
}

ul.kf-b li a.kf5:hover {
    background-position: -176px 0
}

/* #menu .nav1 A {background: url(/skin/img/nav.png) no-repeat 20px 0; } #menu .nav2 A {background: url(/skin/img/nav-02.png) no-repeat 20px 0; } #menu .nav3 A {background: url(/skin/img/nav-03.png) no-repeat 20px 0; } #menu .nav4 A {background: url(/skin/img/nav-04.png) no-repeat 20px 0; } #menu .nav5 A {background: url(/skin/img/nav-05.png) no-repeat 20px 0; } */
.section {
    position: relative;
    text-align: center;
    background-position: center top;
    overflow: hidden;
}

H1 {
    padding-bottom: 0px;
    list-style-type: none;
    margin: 0px;
    padding-left: 0px;
    padding-right: 0px;
    list-style-image: none;
    padding-top: 0px;
}

H2 {
    padding-bottom: 0px;
    list-style-type: none;
    margin: 0px;
    padding-left: 0px;
    padding-right: 0px;
    list-style-image: none;
    padding-top: 0px;
}

H3 {
    padding-bottom: 0px;
    list-style-type: none;
    margin: 0px;
    padding-left: 0px;
    padding-right: 0px;
    list-style-image: none;
    padding-top: 0px;
}

P {
    padding-bottom: 0px;
    list-style-type: none;
    margin: 0px;
    padding-left: 0px;
    padding-right: 0px;
    list-style-image: none;
    padding-top: 0px;
}

UL {
    padding-bottom: 0px;
    list-style-type: none;
    margin: 0px;
    padding-left: 0px;
    padding-right: 0px;
    list-style-image: none;
    padding-top: 0px;
}

LI {
    padding-bottom: 0px;
    list-style-type: none;
    margin: 0px;
    padding-left: 0px;
    padding-right: 0px;
    list-style-image: none;
    padding-top: 0px;
}

H1 {
    position: relative;
}

.div1-about {
    z-index: 999;
    position: absolute;
    width: 100%;
    background: #000;
    height: 100%;
    top: -1100px;
    opacity: 0.95;
    transition: 1s;
    transition-delay: 0s;
}

.div1-pro1 {
    z-index: 999;
    border-bottom: #bc0617 1px solid;
    position: absolute;
    width: 100%;
    background: #000;
    height: 98%;
    top: -1100px;
    opacity: 1;
    transition: 1s;
    transition-delay: 0s;
}

.div1-pro2 {
    z-index: 999;
    position: absolute;
    width: 100%;
    background: #000;
    height: 95%;
    top: -1100px;
    opacity: 1;
    transition: 1s;
    transition-delay: 0s;
}

.div1-pro3 {
    z-index: 999;
    position: absolute;
    width: 100%;
    background: #000;
    height: 95%;
    top: -1100px;
    opacity: 1;
    transition: 1s;
    transition-delay: 0s;
}

.div1-news {
    z-index: 999;
    position: absolute;
    width: 50%;
    background: #000;
    height: 100%;
    top: 0px;
    border-right: #bc0617 1px solid;
    left: -51%;
    opacity: 0.95;
    transition: 1s;
    transition-delay: 0s;
}

.div1-news2 {
    z-index: 999;
    position: absolute;
    width: 50%;
    background: #000;
    height: 100%;
    top: 0px;
    border-right: #bc0617 1px solid;
    left: -51%;
    opacity: 0.95;
    transition: 1s;
    transition-delay: 0s;
}

.div1-news-d {
    z-index: 999;
    position: absolute;
    width: 50%;
    background: #000;
    height: 100%;
    top: 0px;
    right: -51%;
    border-right: #bc0617 1px solid;
    opacity: 0.95;
    transition: 1s;
    transition-delay: 0s;
}

.active-div1-about {
    top: 0px;
    transition-delay: 0;
}

.active-div1-pro1 {
    top: 0px;
    transition-delay: 0;
}

.active-div1-pro2 {
    top: 0px;
    transition-delay: 0;
}

.active-div1-pro3 {
    top: 0px;
    transition-delay: 0;
}

.active-div1-news {
    z-index: 9999;
    left: 0px;
    transition-delay: 0;
}

.active-div1-news-d {
    right: 0px;
    transition-delay: 0;
}

.open-about {
    margin: 0px auto;
    display: block;
}

.open-pro1 {
    margin: 0px auto;
    display: block;
}

open-news {
    margin: 0px auto;
    display: block;
}

.div1-ly {
    z-index: 999;
    position: absolute;
    width: 100%;
    background: #000;
    opacity: 0.95;
    top: 20%;
    padding: 10px 0;
    left: -1920px;
    transition: 1s;
}

.active-div1-ly {
    left: 0;
}

#p2-contant {
    padding-top: 20px;
    height: 100%;
}

.close-about {
    z-index: 9999;
    position: absolute;
    width: 48px;
    height: 0px;
    left: 50%;
    margin-left: -24px;
    bottom: -24px;
    text-align: center;
    overflow: hidden;
    transition: 0.5s;
    transition-delay: 0s;
}

.close-about:hover {
    filter: Alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}

.close-about,
.close-pro1,
.close-pro2,
.close-pro3 {
    z-index: 9999;
    position: absolute;
    width: 48px;
    line-height: 48px;
    height: 0px;
    left: 50%;
    margin-left: -24px;
    bottom: 0;
    color: #FFF;
    display: block;
    transition: 0.5s;
    transition-delay: 0s;
}

.close-about:hover,
.close-pro1:hover,
.close-pro2:hover,
.close-pro3:hover {
    filter: Alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}

.active-close-about,
.active-close-pro1,
.active-close-pro2,
.active-close-pro3 {
    height: 48px;
    bottom: 50px;
    transition-delay: 1s;
}

.close-news,
.close-news2 {
    z-index: 9999;
    position: absolute;
    width: 48px;
    height: 0px;
    margin-left: -24px;
    top: 48%;
    left: 50%;
    overflow: hidden;
    filter: Alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
    transition: 0.5s;
    transition-delay: 0s;
}

.close-news:hover {
    filter: Alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}

.close-news2:hover {
    filter: Alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}

.active-close-news {
    height: 48px;
    transition-delay: 1s;
}

.close-ly:hover {
    filter: Alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}

.close-ly {
    z-index: 9999;
    position: absolute;
    width: 48px;
    height: 0px;
    left: 10%;
    bottom: 50%;
    overflow: hidden;
    filter: Alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
    transition: 0.5s;
    transition-delay: 0s;
}

.active-close-ly {
    height: 48px;
    transition-delay: 1s;
}

#content {
    text-align: left;
    margin: 0px auto;
    width: 1000px;
    color: #ccc;
    font-size: 12px;
}

#content P {
    text-align: left;
    color: #ccc;
    font-size: 12px;
}

.slider1 {
    background: url(/skin/img/p1bg.jpg) no-repeat 50% 50%;
    transition: all 2s;
    background-size: 2880px 1620px;
}

.slider1.active {
    background: url(/skin/img/p1bg.jpg) no-repeat 50% 50%;
    background-size: 1920px 1080px;
    transition-delay: 0s;
}

.slider2 {
    background: url(/skin/img/p1bg2.jpg) no-repeat 50% 50%;
    transition: all 2s;
    background-size: 2880px 1620px;
}

.slider2.active {
    background: url(/skin/img/p1bg2.jpg) no-repeat 50% 50%;
    background-size: 1920px 1080px;
    transition-delay: 0s;
}

.serBox {
    cursor: pointer;
    display: inline;
    width: 138px;
    height: 138px;
    float: left;
    overflow: hidden;
    background: url(/skin/img/p3-2.png) no-repeat;
    position: relative;
}

.serBoxOn {
    display: none;
    width: 138px;
    height: 138px;
    background: url(/skin/img/p3-2-h.png) no-repeat;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 19;
}

.serBox .pic1 {
    width: 60px;
    height: 60px;
    text-align: center;
    position: absolute;
    top: 30px;
    right: 39px;
    z-index: 99;
}

.serBox .pic2 {
    width: 60px;
    height: 60px;
    text-align: center;
    position: absolute;
    top: 30px;
    left: -110px;
    z-index: 99;
}

.serBox .txt1 {
    width: 138px;
    height: 60px;
    color: #fff;
    position: absolute;
    top: 90px;
    left: 0;
    z-index: 99;
}

.serBox .txt2 {
    width: 138px;
    height: 138px;
    color: #a9cf4f;
    position: absolute;
    top: 0px;
    right: -240px;
    z-index: 99;
}

.serBox span.tit {
    font-size: 12px;
    display: block;
    text-align: center;
    text-transform: uppercase;
    text-align: center;
}

.serBox .txt1 .tit {
    color: #ffffff;
    line-height: 30px;
}

.serBox .txt2 .tit {
    color: #bc0617;
    padding-top: 90px;
    height: 48px;
}

.serBox p {
    padding: 0 10px;
    text-align: center;
}

A.tu0 {
    width: 383px;
    display: block;
    background: url(/skin/img/p1.png) no-repeat center center;
    height: 383px;
    transition: all 1s;
}

A.tu0:hover {
    width: 383px;
    display: block;
    background: url(/skin/img/p1-h.png) no-repeat center center;
    height: 383px;
}

A.tu1 {
    width: 223px;
    display: block;
    background: url(/skin/img/p1-02.png) no-repeat center center;
    height: 223px;
    transition: all 1s;
}

A.tu1:hover {
    width: 223px;
    display: block;
    background: url(/skin/img/p1-02h.png) no-repeat center center;
    height: 223px;
}

A.tu2 {
    width: 223px;
    display: block;
    background: url(/skin/img/p1-03.png) no-repeat center center;
    height: 223px;
    transition: all 1s;
}

A.tu2:hover {
    width: 223px;
    display: block;
    background: url(/skin/img/p1-03h.png) no-repeat center center;
    height: 223px;
}

.fp-controlArrow.fp-prev {
    left: 20%;
    width: 66px;
    background: url(/skin/img/arrleft.png) no-repeat;
    height: 131px;
    opacity: 0;
    transition: all 1s;
}

.active .fp-controlArrow.fp-prev {
    left: 10%;
    width: 66px;
    opacity: 0.7;
    transition-delay: 1s;
}

.fp-controlArrow.fp-next {
    right: 20%;
    width: 66px;
    background: url(/skin/img/arrright.png) no-repeat;
    height: 131px;
    opacity: 0;
    opacity: 0.7;
    transition: all 1s;
}

.active .fp-controlArrow.fp-next {
    right: 10%;
    opacity: 0.7;
    transition-delay: 1s;
}

.section01 .cf_content {
    position: relative;
}

.section01 .nr1 {
    width: 760px;
    position: absolute;
    left: 50%;
    margin-left: -600px;
    top: 200px;
    height: 480px;
}

.section01 {
    background: #58595b;
    transition: all 1s;
}

.section01.active {
    background: #58595b;
    transition-delay: 0s;
}

.shipin {
    width: 100vw;
    position: absolute;
    left: 50%;
    margin-left: -50vw;
    top: -10px;
    z-index: 0;
    background: #111;
    z-index: 1;
    /* height: 100vh; */
    opacity: 1;
}

.shipinbg {
    background: #000;
    width: 100vw;
    height: 100vh;
}

.p1-0 {
    position: absolute;
    width: 895px;
    height: 255px;
    top: 10vh;
    left: 50%;
    margin-left: -448px;
    color: #e5e0da;
    font-size: 50px;
    opacity: 0;
    z-index: 2;
    text-align: center;
    transition: all 1s;
    z-index: 9;
}

.p1-0 img {
    margin: 0 auto;
}

.loadimg img {
    margin: 0 auto;
}

.active .p1-0 {
    top: 15vh;
    opacity: 1;
    transition-delay: 0.5s;
}

.p1-2 {
    position: absolute;
    width: 895px;
    height: 35px;
    top: 25vh;
    left: 50%;
    margin-left: -448px;
    color: #fff;
    letter-spacing: 5px;
    font-size: 32px;
    opacity: 0;
    top: 350px;
    text-align: center;
    transition: all 1s;
    z-index: 9;
}

.active .p1-2 {
    top: 48vh;
    opacity: 1;
    transition-delay: 1s;
}

.p1-1 {
    z-index: 2;
    position: absolute;
    width: 210px;
    height: 50px;
    top: 70vh;
    left: 50%;
    line-height: 36px;
    font-size: 14px;
    text-align: left;
    opacity: 0;
    margin-left: -105px;
    transition: all 1s;
}

.active .p1-1 {
    top: 60vh;
    opacity: 1;
    transition-delay: 1.5s;
}

.p1-1 a {
    width: 209px;
    height: 49px;
    display: block;
    border: 1px solid #fff;
    color: #fff;
    line-height: 50px;
    text-align: center;
    transition: all 1s;
}

.p1-1 a:hover {
    width: 209px;
    height: 49px;
    display: block;
    border: 1px solid #fff;
    color: #58595b;
    line-height: 50px;
    text-align: center;
}

.p1-1 a::before {
    content: '';
    z-index: -1;
    position: absolute;
    height: 100%;
    width: 0;
    left: 0;
    top: 0;
    opacity: 0;
    background: #fff;
    transition: all 1s ease;
}

.p1-1 a:hover::before {
    opacity: 1;
    width: 100%;
}

.p1-b {
    position: absolute;
    text-align: center;
    width: 39px;
    height: 20px;
    left: 50%;
    bottom: 15vh;
    opacity: 0;
    z-index: 2;
    margin-left: -20px;
    transition: all 1s;
}

.active .p1-b {
    position: absolute;
    bottom: 10vh;
    opacity: 1;
    transition-delay: 2.5s;
}

.more {
    line-height: 37px;
    text-transform: uppercase;
    margin: 0px auto;
    width: 180px;
    display: block;
    background: #fa9a20;
    height: 37px;
    color: #fff;
    font-size: 12px;
    transition: all 500ms;
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
}

.more:hover {
    line-height: 37px;
    margin: 0px auto;
    width: 190px;
    display: block;
    background: #fff;
    height: 37px;
    color: #fa9a20;
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border: 1px solid #fa9a20;
}

/*鼠标浮动开始*/
.arr {
    width: 43px;
    margin: 0px auto;
    position: relative;
    animation: arrUpdown 1s infinite alternate;
    -webkit-animation: arrUpdown 1s infinite alternate;
}

.arr2 {
    width: 43px;
    height: 22px;
    position: relative;
}

@keyframes arrUpdown {
    from {
        margin-top: -5px;
        opacity: 0.5
    }

    to {
        margin-top: 5px;
        opacity: 0.9
    }
}

@-webkit-keyframes arrUpdown {
    from {
        margin-top: -5px;
        opacity: 0.5
    }

    to {
        margin-top: 5px;
        opacity: 0.9
    }
}

/*鼠标浮动结束*/
/*.container {*/
/*    position: relative;*/
/*    width: 100px;*/
/*    height: 100px;*/
/*}*/

.chevron {
    position: absolute;
    width: 28px;
    height: 3px;
    left: 50%;
    margin-left: -14px;
    opacity: 0;
    transform: scale3d(0.5, 0.5, 0.5);
    animation: move 3s ease-out infinite;
}

.chevron:first-child {
    animation: move 3s ease-out 1s infinite;
}

.chevron:nth-child(2) {
    animation: move 3s ease-out 2s infinite;
}

.chevron:before,
.chevron:after {
    content: ' ';
    position: absolute;
    top: 0;
    height: 100%;
    width: 51%;
    background: #fa9a20;
}

.chevron:before {
    left: 0;
    transform: skew(0deg, 30deg);
}

.chevron:after {
    right: 0;
    width: 50%;
    transform: skew(0deg, -30deg);
}

@keyframes move {
    25% {
        opacity: 1;
    }

    33% {
        opacity: 1;
        transform: translateY(30px);
    }

    67% {
        opacity: 1;
        transform: translateY(40px);
    }

    100% {
        opacity: 0;
        transform: translateY(55px) scale3d(0.5, 0.5, 0.5);
    }
}

.text {
    display: block;
    padding-top: 60px;
    font-size: 12px;
    color: #666;
    text-transform: uppercase;
    white-space: nowrap;
    opacity: .25;
    animation: pulse 2s linear alternate infinite;
}

@keyframes pulse {
    to {
        opacity: 1;
    }
}

.section02 {
    background: url(/skin/img/bj1.png);
    transition: all 1s;
    background-size: 2880px 1620px;
}

.section02.active {
    background: url(/skin/img/bj1.png);
    background-size: 1920px 1080px;
    transition-delay: 0s;
}

.section02 .cf_content {
    position: relative;
}

.nr2 {
    width: 390px;
    position: absolute;
    left: 50%;
    margin-left: 310px;
    top: 20%;
    height: 470px;
    opacity: 0;
    transition: all 1.5s;
    background: #f1f1f1;
}

.active .nr2 {
    opacity: 1;
    margin-left: 210px;
    transition-delay: 1s;
}

.p2-0 {
    position: absolute;
    text-align: center;
    width: 800px;
    height: 470px;
    top: 20%;
    opacity: 0;
    left: 50%;
    margin-left: -700px;
    transition: all 1s;
}

.active .p2-0 {
    margin-left: -600px;
    transition-delay: 1s;
    opacity: 1;
}

.maskwave {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 0;
}

.wave {
    position: absolute;
    top: 150px;
    left: 0;
    width: 100%;
    height: 570px;
    z-index: 0;
    opacity: 0;
    background: none;
    transition: all 1s;
}

.active .wave {
    opacity: 1;
    transition-delay: 2.5s;
}

.p2-1 {
    position: absolute;
    text-align: center;
    width: 100%;
    height: 57px;
    top: 35px;
    opacity: 0;
    transition: all 1s;
}

.p2-1 img {
    margin: 0 auto;
    max-width: 100%;
}

.active .p2-1 {
    position: absolute;
    opacity: 1;
    top: 85px;
    transition-delay: 1.5s;
}

.p2-2 {
    position: absolute;
    text-align: center;
    width: 390px;
    height: 80px;
    left: 50%;
    top: 140px;
    opacity: 0;
    margin-left: -195px;
    color: #888;
    line-height: 26px;
    transition: all 1s;
}

.active .p2-2 {
    position: absolute;
    top: 190px;
    opacity: 1;
    transition-delay: 2s;
}

.p2-3 {
    position: absolute;
    text-align: center;
    width: 30px;
    height: 30px;
    left: 50%;
    top: 280px;
    opacity: 0;
    margin-left: -15px;
    transition: all 1s;
}

.active .p2-3 {
    position: absolute;
    top: 330px;
    opacity: 1;
    transition-delay: 2.5s;
}

.aboutmore {
    width: 30px;
    height: 30px;
    margin: 0 auto;
    display: block;
    border: 1px solid #e1e0e0;
    background: url(/skin/img/more.png) no-repeat center center;
    transition: all 1s;
}

.aboutmore:hover {
    width: 30px;
    height: 30px;
    margin: 0 auto;
    display: block;
    border: 1px solid #58595b;
    background: #58595b url(/skin/img/amore2.png) no-repeat center center;
    transition: all 1s;
}

.sjmore {
    width: 30px;
    height: 30px;
    /* float:left; */
    margin-top: 15px;
    display: inherit;
    border: 1px solid #e1e0e0;
    background: url(/skin/img/amore.png) no-repeat center center;
    transition: all 1s;
}

.sjmore:hover {
    width: 30px;
    height: 30px;
    display: block;
    border: 1px solid #58595b;
    background: #58595b url(/skin/img/amore2.png) no-repeat center center;
    transition: all 1s;
}

.p2-4 {
    position: absolute;
    text-align: center;
    width: 40px;
    height: 20px;
    left: 50%;
    top: 350px;
    opacity: 0;
    margin-left: -20px;
    transition: all 1s;
}

.active .p2-4 {
    position: absolute;
    top: 400px;
    opacity: 1;
    transition-delay: 3s;
}

.section03 {
    background: #ffffff;
    transition: all 1s;
    background-size: 2880px 1620px;
}

.section03.active {
    background: #ffffff;
    background-size: 1920px 1080px;
    transition-delay: 0s;
}

.p3-1 {
    position: absolute;
    top: 0vh;
    left: 0%;
    height: 100%;
    margin-left: -0vw;
    width: 100vw;
}

.active .p3-1 {}

.p3-1 li:nth-child(1) {
    opacity: 0;
    transition: all 1s;
}

.active .p3-1 li:nth-child(1) {
    opacity: 1;
    transition-delay: 1s;
}

.p3-1 li:nth-child(2) {
    opacity: 0;
    transition: all 1s;
}

.active .p3-1 li:nth-child(2) {
    opacity: 1;
    transition-delay: 1s;
}

.p3-1 li:nth-child(3) {
    opacity: 0;
    transition: all 1s;
}

.active .p3-1 li:nth-child(3) {
    opacity: 1;
    transition-delay: 1s;
}

.p3-1 li:nth-child(4) {
    opacity: 0;
    transition: all 1s;
}

.active .p3-1 li:nth-child(4) {
    opacity: 1;
    transition-delay: 1s;
}

.p3-1 li:nth-child(5) {
    opacity: 0;
    transition: all 1s;
}

.active .p3-1 li:nth-child(5) {
    opacity: 1;
    transition-delay: 1s;
}

.p3-1 li:nth-child(6) {
    opacity: 0;
    transition: all 1s;
}

.active .p3-1 li:nth-child(6) {
    opacity: 1;
    transition-delay: 1s;
}

.jg {
    opacity: 1;
    transition: all 1s;
    width: 437px;
    height: 0px;
    position: absolute;
    left: 50%;
    margin-left: -218px;
    bottom: 62px;
    background: url(/skin/img/mprohover.png) no-repeat center top;
    overflow: hidden;
}

.jgactive {
    opacity: 1;
    transition: all 1s;
    width: 437px;
    height: 189px;
    position: absolute;
    left: 50%;
    margin-left: -218px;
    bottom: 62px;
    overflow: hidden;
}

ul.p3-1 li {
    width: 28vw;
    float: left;
    height: 20vw;
    margin: 0.78vw;
    overflow: hidden;
}

ul.p3-1 li a.logo {
    text-indent: -9999px
}

ul.p3-1 li:nth-child(1) {
    background: url(/skin/img/mprobg01.jpg) no-repeat center center;
    transition: all 1s;
    background-size: cover;
    position: relative;
}

ul.p3-1 li:nth-child(1) a.logo {
    width: 100%;
    height: 62px;
    display: block;
    background: rgba(255, 255, 255, 0.8) url(/skin/img/mlogob1.png) no-repeat center center;
    transition: all 1s;
    position: absolute;
    bottom: 0px;
    left: 0;
}

ul.p3-1 li:nth-child(1) a.logo:hover {
    background: rgba(88, 89, 91, 0.9) url(/skin/img/mlogob1h.png) no-repeat center center;
    transition: all 1s;
}

ul.p3-1 li:nth-child(2) {
    background: url(/skin/img/mprobg02.jpg) no-repeat center center;
    transition: all 1s;
    position: relative;
    background-size: cover;
}

ul.p3-1 li:nth-child(2) a.logo {
    width: 100%;
    height: 62px;
    display: block;
    background: rgba(255, 255, 255, 0.8) url(/skin/img/mlogob2.png) no-repeat center center;
    transition: all 1s;
    position: absolute;
    bottom: 0px;
    left: 0;
}

ul.p3-1 li:nth-child(2) a.logo:hover {
    background: rgba(88, 89, 91, 0.9) url(/skin/img/mlogob2h.png) no-repeat center center;
    transition: all 1s;
}

ul.p3-1 li:nth-child(3) {
    background: url(/skin/img/mprobg03.jpg) no-repeat center center;
    transition: all 1s;
    position: relative;
    background-size: cover;
}

ul.p3-1 li:nth-child(3) a.logo {
    width: 100%;
    height: 62px;
    display: block;
    background: rgba(255, 255, 255, 0.8) url(/skin/img/mlogob3.png) no-repeat center center;
    transition: all 1s;
    position: absolute;
    bottom: 0px;
    left: 0;
}

ul.p3-1 li:nth-child(3) a.logo:hover {
    background: rgba(88, 89, 91, 0.9) url(/skin/img/mlogob3h.png) no-repeat center center;
    transition: all 1s;
}

ul.p3-1 li:nth-child(4) {
    background: url(/skin/img/mprobg04.jpg) no-repeat center center;
    transition: all 1s;
    position: relative;
    background-size: cover;
}

ul.p3-1 li:nth-child(4) a.logo {
    width: 100%;
    height: 62px;
    display: block;
    background: rgba(255, 255, 255, 0.8) url(/skin/img/mlogob4.png) no-repeat center center;
    transition: all 1s;
    position: absolute;
    bottom: 0px;
    left: 0;
}

ul.p3-1 li:nth-child(4) a.logo:hover {
    background: rgba(88, 89, 91, 0.9) url(/skin/img/mlogob4h.png) no-repeat center center;
    transition: all 1s;
}

ul.p3-1 li:nth-child(5) {
    background: url(/skin/img/mprobg05.jpg) no-repeat center center;
    transition: all 1s;
    position: relative;
    background-size: cover;
}

ul.p3-1 li:nth-child(5) a.logo {
    width: 100%;
    height: 62px;
    display: block;
    background: rgba(255, 255, 255, 0.8) url(/skin/img/mlogob5.png) no-repeat center center;
    transition: all 1s;
    position: absolute;
    bottom: 0px;
    left: 0;
}

ul.p3-1 li:nth-child(5) a.logo:hover {
    background: rgba(88, 89, 91, 0.9) url(/skin/img/mlogob5h.png) no-repeat center center;
    transition: all 1s;
}

ul.p3-1 li:nth-child(6) {
    background: url(/skin/img/mprobg06.jpg) no-repeat center center;
    transition: all 1s;
    position: relative;
    background-size: cover;
}

ul.p3-1 li:nth-child(6) a.logo {
    width: 100%;
    height: 62px;
    display: block;
    background: rgba(255, 255, 255, 0.8) url(/skin/img/mlogob6.png) no-repeat center center;
    transition: all 1s;
    position: absolute;
    bottom: 0px;
    left: 0;
}

ul.p3-1 li:nth-child(6) a.logo:hover {
    background: rgba(88, 89, 91, 0.9) url(/skin/img/mlogob6h.png) no-repeat center center;
    transition: all 1s;
}

.jg h1 {
    width: 355px;
    /* height: 60px; */
    display: block;
    margin: 0 auto;
    line-height: 30px !important;
    color: #f1f1f1;
    padding-top: 18px;
}

.tb li a .tb {
    width: 34px;
    height: 34px;
    display: block;
    background: url(/skin/img/mtb.jpg) no-repeat;
}

.tb li {
    width: 64px !important;
    height: 64px !important;
    float: left;
    margin: 0 !important;
    background: none !important;
}

.tb li a {
    width: 64px;
    height: 34px;
    display: block;
}

.tb li a .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    transition: all .5s;
}

.tb .tb1 a .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto
}

.tb li a .zi {
    width: 64px;
    height: 34px;
    display: block;
    text-align: center;
    color: #e5e0da
}

.tb li a .zi {
    width: 64px;
    height: 34px;
    display: block;
    text-align: center;
    color: #fff
}

.tb li.tb2 a .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: -34px 0
}

.tb li.tb3 a .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: -68px 0
}

.tb li.tb4 a .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: -102px 0
}

.tb li.tb5 a .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: -136px 0
}

.tb li.tb6 a .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: -170px 0
}

.tb .tb1 a:hover .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: 0 -34px
}

.tb li.tb2 a:hover .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: -34px -34px
}

.tb li.tb3 a:hover .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: -68px -34px
}

.tb li.tb4 a:hover .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: -102px -34px
}

.tb li.tb5 a:hover .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: -136px -34px
}

.tb li.tb6 a:hover .tb {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    background-position: -170px -34px
}

ul.tb {
    width: 385px;
    margin: 0 auto;
    padding-top: 20px;
    height: 60px;
}

.p3-2 {
    position: absolute;
    width: 1200px;
    height: 540px;
    margin-left: -600px;
    top: 250px;
    left: 50%;
    opacity: 1;
    transition: all 1s;
}

.active .p3-2 {
    position: absolute;
    top: 250px;
    opacity: 1;
    transition-delay: 0.5s;
}

.p3-2-1 {
    width: 600px;
    overflow: hidden;
    height: 0px;
    position: relative;
    background: #17181a;
    overflow: hidden;
    transition: all 1s;
    position: absolute;
    left: 0
}

.p3-2-2 {
    width: 600px;
    overflow: hidden;
    height: 0px;
    position: relative;
    background: #222222;
    overflow: hidden;
    transition: all 1s;
    position: absolute;
    right: 0
}

.active .p3-2-1 {
    width: 600px;
    height: 86px;
    float: left;
    background: #17181a;
    overflow: hidden;
    transition-delay: 0.5s;
    padding: 0;
}

.active .p3-2-2 {
    width: 600px;
    height: 86px;
    float: left;
    background: #222222;
    overflow: hidden;
    transition-delay: 2s;
}

.p3-2-1 a {
    width: 600px;
    height: 86px;
    display: block;
    overflow: visible;
    background: #17181a;
    position: absolute;
    transition: all 1s;
    margin: 0;
}

.p3-2-2 a {
    width: 600px;
    height: 86px;
    display: block;
    overflow: visible;
    background: #222222;
    position: absolute;
    transition: all 1s;
    margin: 0;
}

.p3-2-1 a:hover {
    width: 600px;
    height: 86px;
    display: block;
    overflow: visible;
    background: #665044;
}

.p3-2-2 a:hover {
    width: 600px;
    height: 86px;
    display: block;
    overflow: visible;
    background: #533f34;
}

.p3-2-1 span,
.p3-2-2 span {
    width: 22px;
    padding-bottom: 10px;
    border-top: 1px solid #fff;
    display: block;
    margin: 0 auto;
    margin-top: 15px;
    transition: all 1s;
}

.p3-2-1 h1,
.p3-2-2 h1 {
    width: 100px;
    text-align: center;
    color: #fff;
    font-size: 14px;
    height: 25px;
    display: block;
    margin: 0 auto;
    transition: all 1s;
}

.p3-2-1 h2,
.p3-2-2 h2 {
    width: 100px;
    text-align: center;
    color: #533f34;
    font-size: 12px;
    display: block;
    margin: 0 auto;
    transition: all 1s;
}

.p3-2-1 a:hover span,
.p3-2-2 a:hover span {
    width: 60px;
    margin-top: 20px;
}

.p3-2-1 a:hover h1,
.p3-2-2 a:hover h1 {
    font-size: 14px;
    margin-top: 5px;
}

.p3-2-1 a:hover h2,
.p3-2-2 a:hover h2 {
    margin-top: 50px;
}

.p3-3 {
    position: absolute;
    width: 362px;
    height: 145px;
    margin-left: -550px;
    top: 350px;
    left: 50%;
    opacity: 0;
    text-align: left;
    transition: all 1s;
}

.p3-2-3 {
    width: 600px;
    height: 368px;
    float: left;
    background: #222222;
    overflow: hidden;
    transition: all 1s;
    transition: all 2s;
    position: absolute;
    left: 0;
    top: 86px;
    opacity: 0
}

.p3-2-3 img {
    float: left;
}

.p3-2-4 {
    width: 600px;
    height: 368px;
    float: right;
    background: #292929;
    overflow: hidden;
    transition: all 1s;
    transition: all 2s;
    top: 86px;
    position: absolute;
    right: 0;
    top: 86px;
    opacity: 0;
    text-align: center
}

.active .p3-2-3 {
    width: 600px;
    height: 368px;
    float: left;
    background: #222222;
    overflow: hidden;
    transition-delay: 2.5s;
    padding: 0;
    opacity: 1
}

.active .p3-2-4 {
    width: 600px;
    height: 368px;
    float: left;
    background: #292929;
    overflow: hidden;
    transition-delay: 3s;
    padding: 0;
    opacity: 1
}

.p3-2-5 {
    width: 600px;
    height: 0px;
    float: left;
    overflow: hidden;
    transition: all 1s;
    position: absolute;
    left: 0;
    top: 454px;
}

.p3-2-6 {
    width: 600px;
    height: 0px;
    float: right;
    background: #665044;
    overflow: hidden;
    transition: all 1s;
    position: absolute;
    right: 0;
    top: 454px;
}

.p3-2-5 img {
    position: absolute;
    left: 34px;
    top: 26px;
}

.p3-2-6 img {
    position: absolute;
    left: 29px;
    top: 29px;
}

.p3-2-5 span,
.p3-2-6 span {
    width: 22px;
    padding-bottom: 10px;
    border-top: 1px solid #fff;
    display: block;
    margin: 0 auto;
    transition: all 1s;
    position: absolute;
    top: 31px;
    left: 100px;
}

.p3-2-5 a:hover span,
.p3-2-6 a:hover span {
    width: 60px;
    padding-bottom: 10px;
    border-top: 1px solid #fff;
    display: block;
    margin: 0 auto;
    transition: all 1s;
    position: absolute;
    top: 31px;
    left: 100px;
}

.p3-2-5 a {
    width: 600px;
    height: 86px;
    display: block;
    background: #533f34;
    transition: all 1s;
}

.p3-2-6 a {
    width: 600px;
    height: 86px;
    display: block;
    background: #665044;
    transition: all 1s;
}

.p3-2-5 a:hover {
    background: #222222;
}

.p3-2-6 a:hover {
    background: #292929;
}

.p3-2-5 h1,
.p3-2-6 h1 {
    width: 100px;
    text-align: left;
    color: #fff;
    font-size: 14px;
    height: 25px;
    display: block;
    margin: 0 auto;
    transition: all 1s;
    position: absolute;
    line-height: 14px;
    top: 43px;
    left: 100px;
}

.p3-2-5 h2 {
    width: 400px;
    text-align: left;
    color: #8e7567;
    font-size: 12px;
    line-height: 26px !important;
    display: block;
    margin: 0 auto;
    transition: all 1s;
    position: absolute;
    line-height: 14px;
    top: 17px;
    left: 185px;
}

.p3-2-6 h2 {
    width: 400px;
    text-align: left;
    color: #9a8275;
    font-size: 12px;
    line-height: 26px !important;
    display: block;
    margin: 0 auto;
    transition: all 1s;
    position: absolute;
    line-height: 14px;
    top: 17px;
    left: 185px;
}

.active .p3-2-5 {
    width: 600px;
    height: 86px;
    text-align: left;
    float: left;
    overflow: hidden;
    position: relative;
    transition-delay: 3.5s;
}

.active .p3-2-6 {
    width: 600px;
    height: 86px;
    text-align: left;
    float: right;
    overflow: hidden;
    position: relative;
    transition-delay: 4s;
}

.active .p3-3 {
    position: absolute;
    top: 400px;
    opacity: 1;
    transition-delay: 2s;
}

.p3-4 {
    position: absolute;
    width: 1px;
    height: 30px;
    margin-left: -460px;
    top: 530px;
    left: 50%;
    opacity: 0;
    transition: all 1s;
}

.active .p3-4 {
    position: absolute;
    top: 580px;
    opacity: 1;
    transition-delay: 2.5s;
}

.p3-5 {
    z-index: 1;
    position: absolute;
    width: 166px;
    height: 39px;
    margin-left: -551px;
    top: 600px;
    left: 50%;
    opacity: 0;
    transition: all 1s;
}

.active .p3-5 {
    top: 650px;
    opacity: 1;
    transition-delay: 3s;
}

.p3-6 {
    z-index: 1;
    position: absolute;
    width: 614px;
    height: 0;
    margin-left: -67px;
    top: 190px;
    left: 50%;
    opacity: 0;
    overflow: hidden;
    transition: all 1s;
}

.active .p3-6 {
    top: 240px;
    height: 517px;
    opacity: 1;
    transition-delay: 3.5s;
}

.p3-7 {
    z-index: 4;
    position: absolute;
    width: 95px;
    bottom: 80px;
    height: 68px;
    margin-left: -48px;
    left: 50%;
    opacity: 0;
    transition: all 1s;
}

.active .p3-7 {
    z-index: 4;
    position: absolute;
    width: 95px;
    bottom: 30px;
    height: 68px;
    margin-left: -48px;
    left: 50%;
    opacity: 1;
    transition-delay: 4s;
}

.p3-b {
    position: absolute;
    text-align: center;
    width: 39px;
    height: 20px;
    left: 50%;
    bottom: 100px;
    opacity: 0;
    margin-left: -20px;
    transition: all 1s;
}

.active .p3-b {
    position: absolute;
    bottom: 50px;
    opacity: 1;
    transition-delay: 4s;
}

.section04 {
    background: url(../images/bj7.png);
    transition: all 1s;
    background-size: 2880px 1620px;
}

.section04.active {
    background: url(../images/bj7.png);
    background-size: 1920px 1080px;
    transition-delay: 0s;
}

.box04-content {
    position: relative;
    margin: 0px auto;
    width: 903px;
    height: 430px;
    padding-top: 60px;
}

.p4-t {
    position: absolute;
    width: 282px;
    height: 81px;
    margin-left: -141px;
    top: 8vh;
    left: 50%;
    opacity: 0;
    text-align: center;
    transition: all 1s;
}

.ngcpz {
    width: 100% !important;
    height: 100% !important;
    background: #fff !important;
}

.ngcp main {
    height: 100%;
}

.ngcp .syc1 {
    height: 100%;
}

.ngcp .content--c5 {
    height: 100%;
}

.active .p4-t {
    position: absolute;
    top: 20vh;
    opacity: 1;
    transition-delay: 1s;
}

.p4-t h1 {
    font-size: 28px;
    font-family: 'Microsoft Yahei';
    text-align: center;
    color: #fff
}

.p4-t span {
    font-size: 16px;
    /* font-family: arial; */
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    line-height: 30px;
    display: block;
}

.p4-1 a.imga:before {
    content: "";
    width: 0;
    z-index: 99999;
    position: absolute;
    transition: all 1s;
    height: 273px;
    display: block;
    background-color: #533f34;
    opacity: .9
}

.p4-1 a.imga {
    width: 720px;
    height: 275px;
    border: 1px solid #383838;
    padding: 10px;
    display: block;
    overflow: hidden;
}

.p4-1 a.imga:hover:before {
    content: "";
    width: 720px;
    position: absolute;
    height: 273px;
    display: block;
}

.p4-1 a.imga p {
    opacity: 0;
    transition: all 1s;
    position: absolute;
    top: 0;
    color: #fff;
    text-align: center;
    z-index: 9999999;
    width: 720px;
    padding-top: 160px;
}

.p4-1 a.imga:hover p {
    opacity: 1;
    padding-top: 110px;
}

.p4-1 {
    position: absolute;
    width: 1200px;
    height: 500px;
    margin-left: -600px;
    top: 30vh;
    left: 50%;
    opacity: 0;
    text-align: left;
    transition: all 1s;
}

.ngcp {
    position: absolute;
    width: 100%;
    height: 100%;
    margin-left: 0px;
    top: 50vh;
    left: 0;
    opacity: 0;
    text-align: left;
    transition: all 1.5s;
}

.active .p4-1 {
    position: absolute;
    top: 25vh;
    opacity: 1;
    transition-delay: 1.5s;
}

.ngqy {
    top: 45vh;
    width: 90%;
    margin-left: 5%;
    left: 0;
}

.active .ngqy {
    top: 35vh;
}

.active .ngcp {
    top: 0;
    transition-delay: 0s;
}

.tilter__description {
    color: #000;
}

.syc1 img {
    height: 100%;
    width: 100%;
}

ul.p4-1 li {
    position: relative;
    float: left;
    overflow: hidden
}

ul.p4-1 li img {
    transition: all 1s !important;
    -webkit-transition: all 1s !important;
}

ul.p4-1 li a:hover img {
    transform: scale(1.1) !important;
    -webkit-transform: scale(1.1) !important;
    -moz-transform: scale(1.1) !important;
    -ms- transform: scale(1.1) !important;
}

.p4-2 {
    height: 500px;
}

.p4-2 img {
    height: 500px;
}

.p4-3 {
    height: 250px;
    position: relative;
}

.p4-3 img {
    height: 250px;
}

.p4-4 {
    height: 250px;
    width: 400px;
}

.p4-5 {
    height: 250px;
    width: 400px;
    background: #ffffff;
}

.p4-4 .nr {
    height: 250px;
    background: #ffffff;
    padding-top: 60px;
    padding-left: 30px;
    padding-right: 30px;
    font-size: 14px;
    color: #929292;
    line-height: 28px;
}

.p4-5 .nr {
    height: 150px;
    background: #ffffff;
    padding-top: 50px;
    padding-left: 30px;
    padding-right: 30px;
    font-size: 14px;
    color: #929292;
    line-height: 30px;
}

.bt {
    width: 400px;
    height: 50px;
    background: rgba(255, 255, 255, 0.9);
    display: block;
    position: absolute;
    bottom: -8px;
    z-index: 9;
    padding: 10px 20px;
    line-height: 24px;
    transition: all 1s;
}

a:hover .bt {
    width: 400px;
    height: 70px;
    background: rgba(90, 90, 90, 0.9);
    display: block;
    position: absolute;
    bottom: 0;
    z-index: 9;
    padding: 10px 20px;
    line-height: 24px;
}

.bt .tm {
    font-size: 16px;
    color: #58595b;
    transition: all 0.5s;
}

a:hover .bt .tm {
    font-size: 16px;
    color: #fff
}

a .bt .jianjie {
    font-size: 12px;
    color: #dcdcdc;
    opacity: 0;
    transition: all 0.5s;
}

a:hover .bt .jianjie {
    font-size: 12px;
    color: #dcdcdc;
    opacity: 1;
}

a.arr_l {
    width: 44px;
    height: 44px;
    display: block;
    float: left;
    background: url(/skin/img/arr.jpg) no-repeat;
    transition: all .5s;
}

a.arr_r {
    margin-left: 10px;
    width: 44px;
    height: 44px;
    display: block;
    float: left;
    background: url(/skin/img/arr02.jpg) no-repeat;
    transition: all .5s;
}

a.arr_l:hover,
a.arr_r:hover {
    background-position: 0 -44px;
}

.p4-b {
    position: absolute;
    text-align: center;
    width: 39px;
    height: 20px;
    left: 50%;
    bottom: 15vh;
    opacity: 0;
    margin-left: -20px;
    transition: all 1s;
}

.active .p4-b {
    position: absolute;
    bottom: 10vh;
    opacity: 1;
    transition-delay: 2s;
}

.p4-0-0 {
    background: #000;
    width: 0;
    height: 100%;
    float: right;
    transition: all 1s;
}

.active .p4-0-0 {
    width: 50%;
    transition-delay: 0s;
}

.p4-0 {
    position: absolute;
    text-align: center;
    width: 0;
    height: 100%;
    top: 0px;
    background: #000 url(/skin/img/p4r.jpg) no-repeat 50% 50%;
    opacity: .0;
    right: 0px;
    transition: all 1s;
}

.active .p4-0 {
    position: absolute;
    right: 0px;
    width: 50%;
    opacity: .15;
    transition-delay: 0s;
}

.active .p4-0:hover {
    opacity: .25;
    cursor: pointer;
}

.p4-1 a span.newst {
    font-size: 16px;
    padding: 20px 0 10px 0;
    color: #bfa69a;
    display: block;
    transition: all 1s;
}

.p4-1 a span.newsn {
    font-size: 12px;
    color: #6f615a;
    display: block;
    transition: all 1s;
}

.p4-1 a:hover span.newst {
    color: #e5e0da;
    display: block
}

.p4-1 a:hover span.newsn {
    font-size: 12px;
    color: #6f615a;
    display: block
}

.section05 {
    background: url(/skin/img/bj3.png);
    transition: all 1s;
    background-size: 2880px 1620px;
}

.section05.active {
    background: url(/skin/img/bj3.png);
    background-size: 1920px 1080px;
    transition-delay: 0s;
}

.p5-t {
    position: absolute;
    width: 282px;
    height: 81px;
    margin-left: -141px;
    top: 8vh;
    left: 50%;
    opacity: 0;
    text-align: center;
    transition: all 1s;
}

.active .p5-t {
    position: absolute;
    top: 13vh;
    opacity: 1;
    transition-delay: 1s;
}

.p5-t h1 {
    font-size: 28px;
    font-family: 'Microsoft Yahei';
    text-align: center;
    color: #fff
}

.p5-t span {
    font-size: 16px;
    /* font-family: arial; */
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    display: block;
    line-height: 30px;
}

.p5-1 {
    position: absolute;
    text-align: center;
    width: 1200px;
    margin-left: -600px;
    top: 36vh;
    left: 50%;
    height: 370px;
    opacity: 0;
    transition: all 1s;
    z-index: 1;
}

.news_show li a.newsall:hover .bt1 {
    color: rgb(88, 89, 91);
}

.news_show li a.newsall:hover .bt2 {
    color: rgb(155, 153, 152);
}

.active .p5-1 {
    position: absolute;
    top: 23vh;
    opacity: 1;
    transition-delay: 1.5s;
}

.p5-b {
    position: absolute;
    text-align: center;
    width: 39px;
    height: 20px;
    left: 50%;
    bottom: 15vh;
    opacity: 0;
    margin-left: -20px;
    transition: all 1s;
}

.active .p5-b {
    position: absolute;
    bottom: 10vh;
    opacity: 1;
    transition-delay: 2.5s;
}

.p5-1 a:hover {}

.p5-2 {
    position: absolute;
    text-align: center;
    width: 20vh;
    height: 41px;
    margin-left: -150px;
    top: 170px;
    left: 50%;
    opacity: 0;
    transition: all 1s;
    z-index: 1;
}

.active .p5-2 {
    position: absolute;
    top: 25vh;
    opacity: 1;
    transition-delay: 0.5s;
}

.p5-3 {
    position: absolute;
    text-align: center;
    width: 373px;
    height: 113px;
    margin-left: -186px;
    top: 230px;
    left: 50%;
    opacity: 0;
    transition: all 1s;
    z-index: 1;
}

.active .p5-3 {
    position: absolute;
    top: 280px;
    opacity: 1;
    transition-delay: 2s;
}

.p5-4 {
    position: absolute;
    text-align: center;
    width: 615px;
    height: 366px;
    margin-left: -650px;
    top: 450px;
    left: 50%;
    opacity: 0;
    transition: all 1s;
    z-index: 1;
}

.active .p5-4 {
    position: absolute;
    margin-left: -600px;
    opacity: 1;
    transition-delay: 2.5s;
}

.p5-5 {
    position: absolute;
    text-align: center;
    width: 977px;
    height: 626px;
    margin-left: -102px;
    top: 405px;
    left: 50%;
    z-index: 0;
    opacity: 0;
    transition: all 1s;
}

.active .p5-5 {
    position: absolute;
    margin-left: -152px;
    opacity: 1;
    transition-delay: 3s;
}

.section06 {
    background: #f8f8f8;
    transition: all 1s;
}

.section06.active {
    background: url(/skin/img/bj4.png);
    background-size: 1920px 1080px;
    transition-delay: 0s;
}

.section07.active {
    background-size: 1920px 1080px;
    transition-delay: 0s;
}

.p6-map {
    position: absolute;
    width: 1920px;
    height: 22vh;
    margin-left: -960px;
    bottom: 37vh;
    left: 50%;
    opacity: 0;
    text-align: left;
    transition: all 1s;
    overflow: hidden;
}

.active .p6-map {
    position: absolute;
    bottom: 32vh;
    opacity: 1;
    transition-delay: 2s;
}

.p6bg {
    position: absolute;
    width: 100%;
    height: 32vh;
    /* margin-left: -960px; */
    bottom: -100px;
    background: #58595b;
    /* left: 50%; */
    opacity: 0;
    text-align: left;
    transition: all 1s;
}

.active .p6bg {
    position: absolute;
    bottom: 0;
    opacity: 1;
    transition-delay: 2s;
}

.p6-t {
    position: absolute;
    width: 282px;
    height: 81px;
    margin-left: -141px;
    top: 13vh;
    left: 50%;
    opacity: 0;
    transition: all 1s;
}

.p3-1 .syc1 {
    opacity: 0;
    position: absolute;
    top: 20vh;
    transition: all 1s;
}

.active .p3-1 .syc1 {
    opacity: 1;
    position: absolute;
    top: 0vh;
    transition-delay: 0.5s;
}

.active .p6-t {
    position: absolute;
    top: 18vh;
    opacity: 1;
    transition-delay: 1s;
}

.p3-1 #wrap {
    opacity: 0;
    position: absolute;
    top: 20vh;
    transition: all 1s;
}

.active .p3-1 #wrap {
    opacity: 1;
    top: 0vh;
    transition-delay: 1.5s;
}

.syyq1 {
    opacity: 0;
    top: -10vh;
    transition: all 1s;
}

.active .syyq1 {
    opacity: 1;
    top: 10vh;
    transition-delay: 1s;
}

.p6-t h1 {
    font-size: 26px;
    font-family: 'Microsoft Yahei';
    text-align: center;
    color: #58595b
}

.p6-t span {
    font-size: 12px;
    /* font-family: arial; */
    text-align: center;
    text-transform: uppercase;
    color: #8d8d8d;
}

.p6-zi {
    position: absolute;
    width: 1200px;
    height: 30px;
    margin-left: -600px;
    top: 27vh;
    left: 50%;
    opacity: 0;
    text-align: left;
    transition: all 1s;
    text-align: center;
}

.yjzsbt {
    display: none;
}

.active .p6-zi {
    position: absolute;
    top: 32vh;
    opacity: 1;
    transition-delay: 0.5s;
}

.p6-zi a img {
    opacity: 0.75;
    transition: all 1s;
}

.p6-zi a:hover img {
    opacity: 1;
}

.p6-1 {
    position: absolute;
    width: 1200px;
    height: 30px;
    margin-left: -600px;
    top: 28%;
    left: 50%;
    opacity: 0;
    text-align: left;
    transition: all 1s;
    text-align: center;
}

.active .p6-1 {
    position: absolute;
    top: 18%;
    opacity: 1;
    transition-delay: 2.5s;
}

.p6-1 li {
    width: 400px;
    float: left;
    height: 160px;
}

.p6-1 li:nth-child(1) {
    width: 399px;
    float: left;
}

.p6-1 li:nth-child(2) {
    width: 399px;
    float: left;
}

.p6-1 li h1 {
    font-size: 18px;
    color: #e5e0da
}

.p6-1 li a {
    font-size: 14px;
    color: #aaa;
    transition: all 1s;
}

.p6-1 li a:hover {
    font-size: 14px;
    color: #fff
}

.p6-2 {
    position: absolute;
    width: 300px;
    height: 30px;
    margin-left: -150px;
    top: 400px;
    left: 50%;
    opacity: 0;
    text-align: left;
    transition: all 1s;
    text-align: center
}

.active .p6-2 {
    position: absolute;
    top: 450px;
    opacity: 1;
    transition-delay: 2.5s;
}

.p6-2 li {
    width: 150px;
    float: left;
    height: 160px;
}

.p6-1 li h1 {
    font-size: 18px;
    color: #f1f1f1;
    line-height: 36px !important;
}

.p6-1 li h1 a,
.p6-1 li h1 a:hover {
    font-size: 18px;
    color: #f1f1f1;
    line-height: 36px !important;
}

.p5-6 {
    position: absolute;
    text-align: center;
    width: 100%;
    height: 30px;
    bottom: -30px;
    line-height: 30px;
    transition: all 1s;
    font-size: 12px;
    color: #999999;
    background: #4e5052;
}

.p5-6 a {
    font-size: 12px;
    color: #999999;
    display: inline;
}

.p5-6 a img {
    display: inline;
    vertical-align: middle !important;
}

.active .p5-6 {
    position: absolute;
    bottom: 0px;
    transition-delay: 3s;
}

#div1-bot {
    z-index: 999;
    position: fixed;
    width: 182px;
    height: 100%;
    top: 190px;
    right: -182px;
    transition: 1s;
}

#div1-top {
    z-index: 2;
    position: fixed;
    background-color: #ccc;
    width: 100%;
    height: 100%;
    top: -1100px;
}

#div2 {
    position: fixed;
    background-color: #ccc;
    width: 700px;
    height: 100%;
    right: -700px;
}

.open-bot {
    z-index: 1;
    position: fixed;
    text-indent: -9999px;
    width: 50px;
    display: block;
    background: rgba(90, 90, 90, 0.6) url(/skin/img/mtsdh03.png) no-repeat;
    height: 50px;
    top: 30px;
    background-size: cover;
    right: 30px;
    transition: all 1s;
    /* margin-left: -18px; */
}

.open-bot:hover {
    background: rgba(90, 90, 90, 0.8) url(/skin/img/mtsdh03.png) no-repeat;
    transition: all 1s;
    background-size: cover;
}

.open-bot2 {
    z-index: 1;
    position: fixed;
    text-indent: -9999px;
    width: 50px;
    display: block;
    background: rgba(90, 90, 90, 0.6) url(/skin/img/mtsdh02.png) no-repeat;
    height: 50px;
    top: 30px;
    background-size: cover;
    right: 100px;
    transition: all 1s;
    /* margin-left: -18px; */
}

.open-bot2:hover {
    background: rgba(90, 90, 90, 0.8) url(/skin/img/mtsdh02.png) no-repeat;
    transition: all 1s;
    background-size: cover;
}

.open-bot3 {
    z-index: 1;
    position: fixed;
    text-indent: -9999px;
    width: 50px;
    display: block;
    background: rgba(90, 90, 90, 0.6) url(/skin/img/mtsdh01.png) no-repeat;
    height: 50px;
    top: 30px;
    background-size: cover;
    right: 170px;
    transition: all 1s;
    /* margin-left: -18px; */
}

.open-bot3:hover {
    background: rgba(90, 90, 90, 0.8) url(/skin/img/mtsdh01.png) no-repeat;
    transition: all 1s;
    background-size: cover;
}

.open-lt {
    z-index: 1;
    position: fixed;
    width: 34px;
    bottom: 20px;
    display: block;
    right: 2%;
}

.open-bot:hover {
    transition: 0.5s;
}

.close {
    z-index: 999;
    position: absolute;
    text-indent: -9999px;
    width: 47px;
    display: block;
    background: url(/skin/img/close_btn.png) no-repeat center center;
    float: right;
    height: 19px;
    top: 50px;
    right: 5%;
    transition: 0.5s;
    transform: rotate(0deg);
}

.close2 {
    z-index: 999;
    position: absolute;
    text-indent: -9999px;
    width: 47px;
    display: block;
    background: url(/skin/img/close_btn.png) no-repeat center center;
    float: right;
    height: 41px;
    top: 20px;
    right: -47px;
    transition: 0.5s;
    transform: rotate(0deg);
}

.close-top {
    z-index: 999;
    position: absolute;
    text-indent: -9999px;
    width: 47px;
    display: block;
    background: url(/skin/img/close_btn.png) no-repeat center center;
    float: right;
    height: 41px;
    top: 20px;
    right: -47px;
    transition: 0.5s;
    transform: rotate(0deg);
}

.close:hover {
    transition: 0.5s;
    transform: rotate(180deg);
}

.close2:hover {
    transition: 0.5s;
    transform: rotate(180deg);
}

.close-top:hover {
    transition: 0.5s;
    transform: rotate(180deg);
}

.news_t_1 {
    width: 540px;
    text-align: left;
    margin: 0 auto;
    padding-top: 15%;
    padding-bottom: 5%;
}

.ryname {
    z-index: -1;
    position: absolute;
    text-align: center;
    line-height: 35px;
    text-transform: uppercase;
    width: 26px;
    height: 0;
    color: #fff;
    margin-left: -13px;
    font-size: 12px;
    overflow: hidden;
    top: 3px;
    left: 50%;
    transition: all 500ms;
}

.rypic-hover .rypic {
    opacity: 1
}

.ryname-hover .ryname {
    height: 26px;
    top: -36px
}

.news_list_met_m1156_3_6 .info-list a b i h3 {
    color: #fff;
}

.news_list_met_m1156_3_6 .info-list a:hover b span {
    color: #fff;
}

.news_list_met_m1156_3_6 .info-list a b span {
    color: #fff;
    font-size: 16px;
    line-height: 28px;
    display: block;
}

.news_list_met_m1156_3_6 .info-list a p {
    color: #E7E7E7
}

.news_list_met_m1156_3_6 .info-list a:hover p {
    color: #fff;
}

.news_list_met_m1156_3_6 .info-list a b i strong {
    color: #E7E7E7
}

@media screen and (max-height: 850px) {
    .p6bg {
        display: none;
    }

    .active .p5-1 {
        position: absolute;
        top: 30vh;
    }

    .hb {
        margin-top: 70vh;
    }
}

@media screen and (max-height: 800px) {
    .active .p1-2 {
        top: 55vh;
    }

    .active .p1-1 {
        top: 65vh;
    }
}

@media screen and (max-height: 750px) {
    .txt p {
        display: none;
    }
}

@media screen and (max-height: 700px) {
    .active .syyq1 {
        top: 5vh;
    }

    .overlay nav {
        text-align: center;
        position: relative;
        top: 40% !important;
    }

    .active .p3-1 #wrap {
        opacity: 1;
        top: 2vh;
        transition-delay: 1.5s;
    }
}

@media screen and (max-height: 650px) {
    .active .p1-2 {
        top: 55vh;
    }

    .active .p1-1 {
        top: 65vh;
    }

    .active .p1-0 {
        top: 10vh;
    }
}

@media screen and (max-width: 1600px) {}

@media screen and (max-width: 1400px) {}

@media screen and (max-width: 1280px) {}

@media screen and (max-width: 1200px) {
    .p5-1 {
        position: absolute;
        text-align: center;
        width: 800px;
        margin-left: -400px;
    }

    .news_show li:nth-child(3) {
        display: none;
    }

    .active .p2-0 {
        margin-left: -430px;
        transition-delay: 1s;
        opacity: 1;
    }

    .active .nr2 {
        opacity: 1;
        margin-left: 80px;
        transition-delay: 1s;
    }

    .active .p2-1 {
        top: 50px;
    }

    .active .p2-2 {
        top: 130px;
    }

    .active .p2-3 {
        top: 240px;
    }

    .active .p2-4 {
        top: 300px;
    }

    .jg {
        display: none !important;
    }

    .p2-0 {
        top: 25%;
        position: absolute;
        text-align: center;
        width: 500px;
        height: 350px;
        left: 50%;
        margin-left: -250px;
    }

    .p2-0 img {
        max-width: 100%;
        height: 100%;
    }

    .nr2 {
        width: 350px;
        position: absolute;
        left: 50%;
        margin-left: 310px;
        top: 25%;
        height: 350px;
    }
}

@media screen and (max-width:950px) {
    .syyq1 {
        display: none;
    }

    .section03.active {
        background: url(/skin/img/bj4.png);
        background-size: 1920px 1080px;
        transition-delay: 0s;
    }

    .section03 {
        background: url(/skin/img/bj4.png);
        transition: all 1s;
        background-size: 2880px 1620px;
    }

    .yjzsbt {
        display: block;
    }

    .sjxw {
        width: 50%;
    }

    .syyq2 {
        position: absolute;
        top: 45vh;
        opacity: 0;
        transition: all 1s;
        left: 0;
    }

    .active .syyq2 {
        position: absolute;
        top: 30vh;
        opacity: 1;
        transition-delay: 1s;
    }
}

@media screen and (max-width: 800px) {
    .active .p5-6 {
        transition-delay: 2s;
    }

    .news_list_met_m1156_3_6 .info-cut {
        width: 510px;
        margin: 0 auto;
    }

    .news_list_met_m1156_3_6 .info-box {
        margin: 0 0%;
    }

    .active .p5-t {
        position: absolute;
        top: 17vh;
    }

    .news_list_met_m1156_3_6 {
        display: block;
    }

    .news_list_met_m1156_3_6 .info-center {
        margin-top: -200px;
    }

    .news_show li {
        display: none;
    }

    .news_show {
        width: 100%;
        height: 370px;
    }

    .c_news_list-35002 {
        width: 100%;
        height: 370px;
    }

    .active .p5-1 {
        position: absolute;
        top: 32vh;
    }

    .p2-0 {
        top: 10%;
        position: absolute;
        text-align: center;
        width: 100%;
        display: none;
        height: auto;
        left: 50%;
        margin-left: -250px;
    }

    .p2-0 img {
        max-width: 100%;
        height: auto;
    }

    .active .p2-0 {
        margin-left: -50%;
        transition-delay: 1s;
        opacity: 1;
    }

    .section02.active {
        background: url(/skin/img/bj2.png);
        background-size: 1920px 1080px;
        transition-delay: 0s;
    }

    .section02 {
        background: url(/skin/img/bj2.png);
        transition: all 1s;
        background-size: 2880px 1620px;
    }

    .nr2 {
        width: 340px;
        position: absolute;
        left: 50%;
        margin-left: 310px;
        top: 20%;
        height: 400px;
        opacity: 0;
        transition: all 1s;
        background: #fff;
    }

    .active .p2-1 {
        position: absolute;
        opacity: 1;
        top: 45px;
        transition-delay: 0.5s;
    }

    .active .p2-2 {
        position: absolute;
        top: 150px;
        opacity: 1;
        transition-delay: 2s;
    }

    .active .p2-3 {
        position: absolute;
        top: 280px;
        opacity: 1;
        transition-delay: 2.5s;
    }

    .active .p2-4 {
        position: absolute;
        top: 350px;
        opacity: 1;
        transition-delay: 3s;
    }

    .active .nr2 {
        opacity: 1;
        left: 0;
        margin-left: calc(50% - 170px);
    }

    .sjxw {
        width: 80%;
    }
}

.sjxw:hover a p {
    color: #fff !important;
}

@media screen and (max-width: 780px) {
    .nang1 {
        display: block;
    }

    .nang2 {
        display: none;
    }

    .ngcp {
        position: absolute;
        width: 80%;
        height: auto;
        margin-left: 10%;
        left: 10%;
        margin: 0 auto;
    }

    .active .ngcp {
        top: 25vh;
    }

    .syc1 {
        width: 33.33%;
        float: left;
    }

    .syc6 {
        width: 33.33%;
    }

    .ngcpz.active {
        background: url(/skin/img/bj.png) !important;
        background-size: 1920px 1080px !important;
    }

    .ngcpz {
        background-size: 2880px 1620px !important;
        background: url(/skin/img/bj.png) !important;
    }
}

@media (max-width: 767px) {
    .news_list_met_m1156_3_6 .info-center {
        height: auto;
        position: relative;
        top: 0;
        margin-top: 0;
    }
}

@media screen and (max-width: 550px) {
    .p1-2 {
        display: none;
    }

    .p1-0 img {
        width: 250px;
    }

    .active .p1-0 {
        top: 20vh;
    }

    .news_list_met_m1156_3_6 .info-list {
        max-width: 260px;
    }

    .active .ngcp {
        top: 22vh;
    }
}

@media screen and (max-width: 500px) {
    .sjxw {
        width: 90%;
    }

    canvas {
        display: none
    }

    .nang1 {
        display: none;
    }

    .tilter__figure {
        height: 200px;
    }

    .nang2 {
        display: block
    }

    .syc1 {
        width: 50%;
        overflow: hidden;
        float: left;
        max-height: 200px;
    }

    .syc6 {
        width: 100%;
        overflow: hidden;
        max-height: 200px;
    }

    .syc1 img {
        height: auto;
        width: 100%;
    }

    #fp-nav.right {
        right: 15px;
    }

    .open-bot {
        right: 15px;
        top: 15px;
    }

    .logoA-active .clickimg {
        position: fixed;
        left: 15px;
        top: 20px;
    }

    .logoA .clickimg {
        position: fixed;
        left: 15px;
        top: 20px;
        cursor: pointer;
        transition: 0.5s;
    }

    .clickimg {
        position: fixed;
        left: 15px;
        top: 20px;
    }
}

ul.fenlei {
    margin: 0 auto;
    /* left: 50%; */
    padding-top: 0px;
    position: absolute;
}

ul.fenlei li.fl {
    padding: 0 10px;
    height: 35px;
    line-height: 35px;
    float: left;
    border-radius: 10px;
    position: relative;
    /* overflow:hidden; */
}

ul.fenlei li.fl.active a {
    width: 128px;
    height: 32px;
    line-height: 32px;
    display: block;
    background: #e5e0da;
    color: #533f34;
    border: 1px solid #e5e0da;
    text-align: center;
}

ul.fenlei li.fl a:hover {
    width: 128px;
    height: 32px;
    line-height: 32px;
    display: block;
    background: #58595b;
    color: #fff;
    border: 1px solid #58595b;
    text-align: center;
}

ul.fenlei li.fl a {
    width: 128px;
    border: 1px solid #e1e0e0;
    height: 32px;
    line-height: 32px;
    display: block;
    color: #58595b;
    text-align: center;
    transition: all 500ms;
    background: #fff;
    font-size: 14px;
}

.music {
    z-index: 1;
    position: fixed;
    width: 34px;
    bottom: 198px;
    display: block;
    right: 2%;
    height: 30px;
    overflow: hidden;
    text-align: center;
}

.music a {
    cursor: pointer;
    opacity: .6 }